import React, { Component } from 'react'
import './index.less'
import { Card } from 'antd'
import { Link } from 'react-router-dom'

export default class PersonnelItem extends Component {

  state = {
    avatar: '/assets/home/avatar.jpg'
  }
  componentWillMount() {
    if (this.props.data.avatar) {
      this.setState({
        avatar: this.props.data.avatar
      })
    }
  }

  render() {
    return (
      <Link to={{pathname:'/home/personalWeekly', state: this.props.data}}>
          <Card className="personal" bodyStyle={{ padding: 0 }}>
            <div className="personal-image">
              <img alt="avatar" src={this.state.avatar} />
            </div>
            <div className="personal-card">
              <h3 className={this.props.data.reportStatus ? '' : "color-red"}>{this.props.data.username}</h3>
            </div>
          </Card>
      </Link>
    )
  }
}
